<template>
  <div class="container" v-show="baseData">
    <div class="action-btn">
      <a href="javascript:;" class="activeCenter" @click="activeCenter"></a>
      <a
        href="javascript:;"
        class="reward-log"
        v-on:click="shuomingFlag = true"
      ></a>
      <a href="javascript:;" class="gm-jq" v-on:click="passFlag = true"></a>
      <a href="javascript:;" class="gmjl" v-on:click="_QueryHistory"></a>
      <a v-bind:href="baseData.jump_url" class="back"></a>
    </div>
    <!-- 头部 -->
    <div class="head-box">
      <h1 class="template-name">{{ baseData.act_title }}</h1>
      <div class="user-box">
        <span
          ><i class="game-icon"></i
          >{{ baseData.map_name ? baseData.map_name : "--" }}</span
        >
        <span><i class="user-icon"></i>{{ baseData.user_name }}</span>
      </div>
      <div class="timer">
        活动有效期：<span>{{ st_time }} 至 {{ ed_time }}</span>
      </div>
      <div class="title-xian"></div>
    </div>
    <!-- 头部 -->

    <template v-if="!baseData.advanced_pass_isclose">
      <!-- 高低阶通行证部分 -->

      <div class="template-box">
        <div class="template-box-title"></div>
        <div class="template-hd">
          <div class="leve">
            <em>{{ baseData.level }}</em>
          </div>
          <div class="user-info">
            <div class="buy-leve">
              <p>请选择购买等级：</p>
              <div class="buy-num">
                <em class="mus" v-on:click="relsove2">-</em
                ><input type="text" v-model="message04" /><em
                  class="add"
                  v-on:click="add2"
                  >+</em
                >
              </div>
            </div>
            <a
              href="javascript:;"
              class="upLeve"
              v-on:click="gmProduct(message04, baseData.goodsid_exe)"
            ></a>
            <div class="progress">
              <div class="progress-num">{{ baseData.exe }}/3000</div>
              <div class="in-progress" :style="{ width: lengthW }"></div>
            </div>
          </div>
          <div class="buy-pass" v-on:click="passFlag = true"></div>
        </div>
        <div class="end-time">
          <p>
            通行证等级奖励-领取截止时间：<em>{{ ed_time }}</em>
            <el-tooltip
              v-if="baseData.flag_refreshed == 0"
              class="item"
              effect="dark"
              content=" 如作者设置了此道具对应的转化积分，且你已经拥有了永久时效的此道具，领取后奖励回被分解成地图积分发放。"
              placement="bottom"
            >
              <i
                class="el-icon-warning-outline"
                style="
                  cursor: pointer;
                  color: rgba(255, 58, 50, 1);
                  margin-left: 5px;
                  font-weight: bold;
                "
              ></i>
            </el-tooltip>
          </p>
          <a
            href="javascript:;"
            v-on:click="RcvAllFn"
            v-if="flag_rcv_all"
            class="lq-all"
            >全部领取</a
          >
          <a
            href="javascript:;"
            v-on:click="RcvAllFn"
            v-if="!flag_rcv_all"
            class="bklq-all"
            >全部领取</a
          >
        </div>
        <!-- 通行证等级奖励 -->
        <div class="pass">
          <div class="pass-xian"></div>
          <a href="javascript:;" class="raw-left" v-on:click="moveLeft"></a>
          <a href="javascript:;" class="raw-right" v-on:click="moveRight"></a>
          <div class="pass-left">
            <div class="pass-left-hd"></div>
            <div class="common-pass">
              <p>{{ baseData.name_primary_pass }}</p>
              <div
                class="show-common-pass"
                v-if="!baseData.goods_primary_isfree"
              >
                <a
                  href="javascript:;"
                  class="gmtxz-btn"
                  v-on:click="gmProduct(1, baseData.goodsid_primary_pass)"
                  >获取通行证</a
                >
                <div class="price-show">
                  {{ `￥${baseData.price_primary_pass}/1个` }}
                </div>
              </div>
              <div
                class="show-common-pass"
                v-if="
                  baseData.goods_primary_isfree &&
                  baseData.flag_primary_pass == 0
                "
              >
                <a
                  href="javascript:;"
                  class="gmtxz-btn"
                  v-on:click="RcvFreePrimaryPass"
                  >领取通行证</a
                >
                <div class="price-show">免费</div>
              </div>
            </div>
            <div class="advance-pass">
              <p>{{ baseData.name_advanced_pass }}</p>
              <div
                class="show-advance-pass"
                v-if="!baseData.advanced_pass_isclose"
              >
                <a
                  href="javascript:;"
                  class="gmtxz-btn"
                  v-on:click="
                    gmProduct(message02, baseData.goodsid_advanced_pass)
                  "
                  >获取通行证</a
                >
                <div class="price-show">
                  {{ `￥${baseData.price_advanced_pass}/1个` }}
                </div>
              </div>
            </div>
          </div>
          <div class="pass-right">
            <ul ref="ulBox">
              <li v-for="(item, index) in lst_gift" v-bind:key="index">
                <div class="leve-hd">{{ `Lv.${item.level}` }}</div>
                <div class="common" v-if="item.itm_primary">
                  <div
                    class="detail-info"
                    v-show="item.itm_primary && item.seen && showName == '普通'"
                    :style="{ left: tranLeft, top: tranTop }"
                  >
                    <div class="in-detail-info">
                      <div
                        class="row"
                        v-show="item.itm_primary && item.itm_primary.price"
                      >
                        <i class="jiazhi"></i> <span>奖项价值:</span
                        ><b
                          >{{ item.itm_primary && item.itm_primary.price }}元</b
                        >
                      </div>
                      <div
                        class="row2"
                        v-show="item.itm_primary && item.itm_primary.desc"
                      >
                        <p class="title"><i class="sm"></i>奖项说明：</p>
                        <p>{{ item.itm_primary && item.itm_primary.desc }}</p>
                      </div>
                      <div
                        class="row2"
                        v-show="item.itm_primary && item.itm_primary.detail"
                      >
                        <p class="title"><i class="mingxi"></i>奖品明细：</p>
                        <p>
                          {{ item.itm_primary && item.itm_primary.detail }}
                        </p>
                      </div>
                    </div>
                  </div>
                  <div class="img-box">
                    <i v-if="item.rarity" v-bind:class="item.rarity"></i>
                    <img
                      v-bind:src="
                        item.itm_primary == null ? '' : item.itm_primary.icon
                      "
                      v-on:mouseenter.stop="
                        handleMouseOver(item, $event, '普通')
                      "
                      v-on:mouseleave.stop="onMouseOut(item)"
                      alt=""
                    />

                    <p
                      class="common_name"
                      v-if="item.itm_primary && item.itm_primary.type == 2"
                      v-text="
                        item.itm_primary.show_name == null
                          ? item.itm_primary.item_name +
                            '*' +
                            ('' + item.itm_primary.amount != '7884000'
                              ? item.itm_primary.amount / 1440 + '天'
                              : '永久' + '  ')
                          : item.itm_primary.show_name +
                            '*' +
                            (' ' + item.itm_primary.amount != '7884000'
                              ? item.itm_primary.amount / 1440 + '天'
                              : '永久' + ' ')
                      "
                      v-bind:title="
                        item.itm_primary.show_name == null
                          ? item.itm_primary.item_name +
                            '*' +
                            ('' + item.itm_primary.amount != '7884000'
                              ? item.itm_primary.amount / 1440 + '天'
                              : '永久' + '  ')
                          : item.itm_primary.show_name +
                            '*' +
                            ('' + item.itm_primary.amount != '7884000'
                              ? item.itm_primary.amount / 1440 + '天'
                              : '永久' + ' ')
                      "
                    ></p>
                    <p
                      class="common_name"
                      v-if="item.itm_primary && item.itm_primary.type == 1"
                      v-text="
                        item.itm_primary.show_name == null
                          ? item.itm_primary.item_name +
                            '*' +
                            item.itm_primary.amount +
                            '个'
                          : item.itm_primary.show_name +
                            item.itm_primary.amount +
                            '个'
                      "
                      v-bind:title="
                        item.itm_primary.show_name == null
                          ? item.itm_primary.item_name +
                            '*' +
                            item.itm_primary.amount +
                            '个'
                          : item.itm_primary.show_name +
                            '*' +
                            item.itm_primary.amount +
                            '个'
                      "
                    ></p>
                    <a
                      href="javascript::"
                      class="lq"
                      v-if="item.itm_primary && item.itm_primary.flag_rcv == 0"
                      v-on:click="_RcvGloryGift('c', item.level)"
                      >领取</a
                    >
                    <a
                      href="javascript::"
                      class="ylq"
                      v-if="item.itm_primary && item.itm_primary.flag_rcv == 1"
                      >已领取</a
                    >
                    <a
                      href="javascript::"
                      class="bklq"
                      v-if="
                        item.itm_primary &&
                        item.itm_primary.type == 2 &&
                        item.itm_primary.flag_rcv == -1
                      "
                      v-text="
                        item.itm_primary == null
                          ? ''
                          : item.itm_primary.amount != '7884000'
                          ? item.itm_primary.amount / 1440 + '天'
                          : '永久'
                      "
                      v-bind:class="{
                        thrity:
                          item.itm_primary == null
                            ? ''
                            : item.itm_primary.amount != '7884000',
                        long: item.itm_primary.amount == '7884000',
                      }"
                    ></a>
                    <a
                      href="javascript::"
                      class="bklq"
                      v-if="
                        item.itm_primary.type == 1 &&
                        item.itm_primary.flag_rcv == -1
                      "
                      v-text="
                        item.itm_primary == null
                          ? ''
                          : item.itm_primary.amount + '个'
                      "
                    ></a>
                  </div>
                </div>
                <div class="common" v-if="!item.itm_primary">
                  <img
                    style="width: 137px; height: 137px"
                    v-if="!item.itm_primary"
                    :src="'https://img.5211game.com/Base/no-gifts-big.png'"
                  />
                  <p class="common_name" v-if="!item.itm_primary">无奖励</p>
                </div>
                <div class="advance" v-if="item.itm_advanced">
                  <div
                    class="detail-info"
                    v-show="
                      item.itm_advanced && item.seen && showName == '进阶'
                    "
                    :style="{ left: tranLeft, top: tranTop }"
                  >
                    <div class="in-detail-info">
                      <div class="row" v-show="item.itm_advanced.price">
                        <i class="jiazhi"></i> <span>奖项价值:</span
                        ><b>{{ item.itm_advanced.price }}元</b>
                      </div>
                      <div class="row2" v-show="item.itm_advanced.desc">
                        <p class="title"><i class="sm"></i>奖项说明：</p>
                        <p>{{ item.itm_advanced.desc }}</p>
                      </div>
                      <div class="row2" v-show="item.itm_advanced.detail">
                        <p class="title"><i class="mingxi"></i>奖品明细：</p>
                        <p>{{ item.itm_advanced.detail }}</p>
                      </div>
                    </div>
                  </div>
                  <div class="img-box">
                    <i v-if="item.rarity" v-bind:class="item.rarity"></i>
                    <img
                      v-bind:src="
                        item.itm_advanced == null ? '' : item.itm_advanced.icon
                      "
                      v-on:mouseenter.stop="
                        handleMouseOver(item, $event, '进阶')
                      "
                      v-on:mouseleave.stop="onMouseOut(item)"
                    />
                  </div>
                  <p
                    class="common_name"
                    v-if="item.itm_advanced.type == 2"
                    v-text="
                      item.itm_advanced.show_name == null
                        ? item.itm_advanced.item_name +
                          '*' +
                          ('' + item.itm_advanced.amount != '7884000'
                            ? item.itm_advanced.amount / 1440 + '天'
                            : '永久' + '  ')
                        : item.itm_advanced.show_name +
                          '*' +
                          (' ' + item.itm_advanced.amount != '7884000'
                            ? item.itm_advanced.amount / 1440 + '天'
                            : '永久' + ' ')
                    "
                    v-bind:title="
                      item.itm_advanced == null
                        ? ''
                        : item.itm_advanced.show_name == null
                        ? item.itm_advanced.item_name +
                          '*' +
                          ('' + item.itm_advanced.amount != '7884000'
                            ? item.itm_advanced.amount / 1440 + '天'
                            : '永久' + '  ')
                        : item.itm_advanced.show_name +
                          '*' +
                          ('' + item.itm_advanced.amount != '7884000'
                            ? item.itm_advanced.amount / 1440 + '天'
                            : '永久' + ' ')
                    "
                  ></p>
                  <p
                    class="common_name"
                    v-if="item.itm_advanced.type == 1"
                    v-text="
                      item.itm_advanced.show_name == null
                        ? item.itm_advanced.item_name +
                          '*' +
                          item.itm_advanced.amount +
                          '个'
                        : item.itm_advanced.show_name +
                          '*' +
                          item.itm_advanced.amount +
                          '个'
                    "
                    v-bind:title="
                      item.itm_advanced.show_name == null
                        ? item.itm_advanced.item_name +
                          '*' +
                          item.itm_advanced.amount +
                          '个'
                        : item.itm_advanced.show_name +
                          '*' +
                          item.itm_advanced.amount +
                          '个'
                    "
                  ></p>
                  <a
                    href="javascript:;"
                    class="lq"
                    v-if="item.itm_advanced.flag_rcv == 0"
                    v-on:click="_RcvGloryGift('h', item.level)"
                    >领取</a
                  >
                  <a
                    href="javascript:;"
                    class="bklq"
                    v-if="
                      item.itm_advanced.type == 2 &&
                      item.itm_advanced.flag_rcv == -1
                    "
                    v-text="
                      item.itm_advanced == null
                        ? ''
                        : item.itm_advanced.amount != '7884000' &&
                          item.itm_advanced != null
                        ? item.itm_advanced.amount / 1440 + '天'
                        : '永久'
                    "
                    v-bind:class="{
                      thrity:
                        item.itm_advanced != null &&
                        item.itm_advanced.amount != '7884000',
                      long: item.itm_advanced.amount == '7884000',
                    }"
                  ></a>
                  <a
                    href="javascript:;"
                    v-if="
                      item.itm_advanced.type == 1 &&
                      item.itm_advanced.flag_rcv == -1
                    "
                    v-text="
                      item.itm_advanced == null
                        ? ''
                        : item.itm_advanced.amount + '个'
                    "
                    class="bklq"
                  ></a>
                  <a
                    href="javascript:;"
                    class="ylq"
                    v-if="item.itm_advanced.flag_rcv == 1"
                    >已领取</a
                  >
                </div>
              </li>
            </ul>
          </div>
        </div>
        <!-- 通行证等级奖励 -->
      </div>
      <!-- 高低阶通行证部分 -->
    </template>
    <template v-else-if="baseData.advanced_pass_isclose">
      <!-- 低阶通行证部分 -->
      <div class="template-box" style="height: 470px">
        <div class="template-box-title"></div>
        <div class="template-hd">
          <div class="leve">
            <em>{{ baseData.level }}</em>
          </div>
          <div class="user-info">
            <div class="buy-leve">
              <p>请选择购买等级：</p>
              <div class="buy-num">
                <em class="mus" v-on:click="relsove2">-</em
                ><input type="text" v-model="message04" /><em
                  class="add"
                  v-on:click="add2"
                  >+</em
                >
              </div>
            </div>
            <a
              href="javascript:;"
              class="upLeve"
              v-on:click="gmProduct(message04, baseData.goodsid_exe)"
            ></a>
            <div class="progress">
              <div class="progress-num">{{ baseData.exe }}/3000</div>
              <div class="in-progress" :style="{ width: lengthW }"></div>
            </div>
          </div>
          <div class="buy-pass" v-on:click="passFlag = true"></div>
        </div>
        <div class="end-time">
          <p>
            通行证等级奖励-领取截止时间：<em>{{ ed_time }}</em>
            <el-tooltip
              v-if="baseData.flag_refreshed == 0"
              class="item"
              effect="dark"
              content=" 如作者设置了此道具对应的转化积分，且你已经拥有了永久时效的此道具，领取后奖励回被分解成地图积分发放。"
              placement="bottom"
            >
              <i
                class="el-icon-warning-outline"
                style="
                  cursor: pointer;
                  color: rgba(255, 58, 50, 1);
                  margin-left: 5px;
                  font-weight: bold;
                "
              ></i>
            </el-tooltip>
          </p>
          <a href="javascript:;" v-on:click="RcvAllFn" class="lq-all"
            >全部领取</a
          >
        </div>
        <!-- 通行证等级奖励 -->
        <div class="pass" style="height: 228px">
          <a
            href="javascript:;"
            class="raw-left"
            style="top: 100px"
            v-on:click="moveLeft"
          ></a>
          <a
            href="javascript:;"
            class="raw-right"
            style="top: 100px"
            v-on:click="moveRight"
          ></a>
          <div class="pass-left">
            <div class="pass-left-hd"></div>
            <div class="common-pass">
              <p>{{ baseData.name_primary_pass }}</p>
              <div
                class="show-common-pass"
                v-if="!baseData.goods_primary_isfree"
              >
                <a
                  href="javascript:;"
                  class="gmtxz-btn"
                  v-on:click="gmProduct(1, baseData.goodsid_primary_pass)"
                  >获取通行证</a
                >
              </div>
              <div
                class="show-common-pass"
                v-if="
                  baseData.goods_primary_isfree &&
                  baseData.flag_primary_pass == 0
                "
              >
                <a
                  href="javascript:;"
                  class="gmtxz-btn"
                  v-on:click="RcvFreePrimaryPass"
                  >领取通行证</a
                >
              </div>
            </div>
          </div>
          <div class="pass-right" style="height: 228px">
            <ul ref="ulBox">
              <li
                v-for="(item, index) in lst_gift"
                v-bind:key="index"
                style="height: 228px"
              >
                <div class="leve-hd">{{ `Lv.${item.level}` }}</div>
                <div class="common" v-if="item.itm_primary">
                  <div
                    class="detail-info"
                    v-show="item.itm_primary && item.seen && showName == '普通'"
                    :style="{ left: tranLeft, top: tranTop }"
                  >
                    <div class="in-detail-info">
                      <div
                        class="row"
                        v-show="item.itm_primary && item.itm_primary.price"
                      >
                        <i class="jiazhi"></i> <span>奖项价值:</span
                        ><b
                          >{{ item.itm_primary && item.itm_primary.price }}元</b
                        >
                      </div>
                      <div
                        class="row2"
                        v-show="item.itm_primary && item.itm_primary.desc"
                      >
                        <p class="title"><i class="sm"></i>奖项说明：</p>
                        <p>{{ item.itm_primary && item.itm_primary.desc }}</p>
                      </div>
                      <div
                        class="row2"
                        v-show="item.itm_primary && item.itm_primary.detail"
                      >
                        <p class="title"><i class="mingxi"></i>奖品明细：</p>
                        <p>
                          {{ item.itm_primary && item.itm_primary.detail }}
                        </p>
                      </div>
                    </div>
                  </div>
                  <div class="img-box">
                    <i v-if="item.rarity" v-bind:class="item.rarity"></i>
                    <img
                      v-bind:src="
                        item.itm_primary == null ? '' : item.itm_primary.icon
                      "
                      v-on:mouseenter.stop="
                        handleMouseOver(item, $event, '普通')
                      "
                      v-on:mouseleave.stop="onMouseOut(item)"
                      alt=""
                    />
                  </div>
                  <p
                    class="common_name"
                    v-if="item.itm_primary && item.itm_primary.type == 2"
                    v-text="
                      item.itm_primary.show_name == null
                        ? item.itm_primary.item_name +
                          '*' +
                          ('' + item.itm_primary.amount != '7884000'
                            ? item.itm_primary.amount / 1440 + '天'
                            : '永久' + '  ')
                        : item.itm_primary.show_name +
                          '*' +
                          (' ' + item.itm_primary.amount != '7884000'
                            ? item.itm_primary.amount / 1440 + '天'
                            : '永久' + ' ')
                    "
                    v-bind:title="
                      item.itm_primary.show_name == null
                        ? item.itm_primary.item_name +
                          '*' +
                          ('' + item.itm_primary.amount != '7884000'
                            ? item.itm_primary.amount / 1440 + '天'
                            : '永久' + '  ')
                        : item.itm_primary.show_name +
                          '*' +
                          ('' + item.itm_primary.amount != '7884000'
                            ? item.itm_primary.amount / 1440 + '天'
                            : '永久' + ' ')
                    "
                  ></p>
                  <p
                    class="common_name"
                    v-if="item.itm_primary && item.itm_primary.type == 1"
                    v-text="
                      item.itm_primary.show_name == null
                        ? item.itm_primary.item_name +
                          '*' +
                          item.itm_primary.amount +
                          '个'
                        : item.itm_primary.show_name +
                          '*' +
                          item.itm_primary.amount +
                          '个'
                    "
                    v-bind:title="
                      item.itm_primary.show_name == null
                        ? item.itm_primary.item_name +
                          '*' +
                          item.itm_primary.amount +
                          '个'
                        : item.itm_primary.show_name +
                          '*' +
                          item.itm_primary.amount +
                          '个'
                    "
                  ></p>
                  <a
                    href="javascript::"
                    class="lq"
                    v-if="item.itm_primary && item.itm_primary.flag_rcv == 0"
                    v-on:click="_RcvGloryGift('c', item.level)"
                    >领取</a
                  >
                  <a
                    href="javascript::"
                    class="ylq"
                    v-if="item.itm_primary && item.itm_primary.flag_rcv == 1"
                    >已领取</a
                  >
                  <a
                    href="javascript::"
                    class="bklq"
                    v-if="
                      item.itm_primary &&
                      item.itm_primary.type == 2 &&
                      item.itm_primary.flag_rcv == -1
                    "
                    v-text="
                      item.itm_primary == null
                        ? ''
                        : item.itm_primary.amount != '7884000'
                        ? item.itm_primary.amount / 1440 + '天'
                        : '永久'
                    "
                    v-bind:class="{
                      thrity:
                        item.itm_primary == null
                          ? ''
                          : item.itm_primary.amount != '7884000',
                      long: item.itm_primary.amount == '7884000',
                    }"
                  ></a>
                  <a
                    href="javascript::"
                    class="bklq"
                    v-if="
                      item.itm_primary.type == 1 &&
                      item.itm_primary.flag_rcv == -1
                    "
                    v-text="
                      item.itm_primary == null
                        ? ''
                        : item.itm_primary.amount + '个'
                    "
                  ></a>
                </div>
                <div class="common" v-if="!item.itm_primary">
                  <img
                    style="width: 137px; height: 137px"
                    v-if="!item.itm_primary"
                    :src="'https://img.5211game.com/Base/no-gifts-big.png'"
                  />
                  <p class="common_name" v-if="!item.itm_primary">无奖励</p>
                </div>
              </li>
            </ul>
          </div>
        </div>
        <!-- 通行证等级奖励 -->
      </div>
      <!-- 低阶通行证部分 -->
    </template>

    <!-- 满级奖励 -->
    <div class="limit-reward">
      <div
        class="limit-reward-item"
        v-for="(item, index) in FullLts"
        v-bind:key="index"
      >
        <a
          href="javascript:;"
          @click="GetLogFullLevelFn(item.tp)"
          class="lqjl"
        ></a>
        <a
          href="javascript:;"
          v-if="item.flag == -1"
          class="bklq-btn"
          @click="RcvFullGiftFn(item.tp)"
          >不可领取</a
        >
        <a
          href="javascript:;"
          v-if="item.flag == 0"
          class="lq-btn"
          @click="RcvFullGiftFn(item.tp)"
          >领取</a
        >
        <a
          href="javascript:;"
          v-if="item.flag == 1"
          class="bklq-btn"
          @click="RcvFullGiftFn(item.tp)"
          >已领取</a
        >
        <div class="level-title">
          等级＞<em>{{ item.lv }}</em
          >级
        </div>
        <div class="limit-img-box">
          <div
            class="detail-info"
            v-show="item.seen"
            :style="{ left: tranLeft, top: tranTop }"
          >
            <div class="in-detail-info">
              <div class="row" v-show="item.price">
                <i class="jiazhi"></i> <span>奖项价值:</span
                ><b>{{ item.price }}元</b>
              </div>
              <div class="row2" v-show="item.desc">
                <p class="title"><i class="sm"></i>奖项说明：</p>
                <p>{{ item.desc }}</p>
              </div>
              <div class="row2" v-show="item.send_name">
                <p class="title"><i class="mingxi"></i>奖品明细：</p>
                <p>{{ item.send_name }}</p>
              </div>
            </div>
          </div>
          <i v-if="item.rarity" v-bind:class="item.rarity"></i>
          <img
            v-bind:src="item.img"
            v-on:mouseenter.stop="handleMouseOver(item, $event)"
            v-on:mouseleave.stop="onMouseOut(item)"
            alt=""
          />
          <p class="limit-kuang"></p>
        </div>
        <div class="limit-info">
          <h1 class="tips">
            【{{ item.show_tip }}】<span>{{ item.name }}</span>
          </h1>
          <div class="limit-info-desc">
            <p v-if="item.tp == 1">
              领取条件：<span style="color: rgba(255, 193, 27, 1)">{{
                `购买了初级通行证且等级超过${item.lv}级之后,每升一级可领取一次`
              }}</span>
            </p>
            <p v-if="item.tp == 2">
              领取条件：<span style="color: rgba(255, 193, 27, 1)">{{
                `购买了高级通行证且等级超过${item.lv}级之后,每升一级可领取一次`
              }}</span>
            </p>
            <p>发放物品：{{ item.send_name }}</p>
          </div>
        </div>
      </div>
    </div>
    <!-- 满级奖励 -->
    <!-- 每日任务 -->
    <div class="task-day">
      <div class="task-xian"></div>
      <div class="task-hd">
        <div class="task-left">
          <i class="icon-task"></i
          ><span style="margin-right: 10px">每日任务-任务刷新时间:</span
          ><em>每日6点</em>
          <el-tooltip
            v-if="baseData.flag_refreshed == 0"
            class="item"
            effect="dark"
            content="通行证任务只统计主账号的有效游戏局数据（即产生积分弹框），请使用主账号参与活动！"
            placement="bottom"
          >
            <i
              class="el-icon-warning-outline"
              style="
                cursor: pointer;
                color: rgba(255, 58, 50, 1);
                margin-left: 5px;
                font-weight: bold;
              "
            ></i>
          </el-tooltip>
        </div>
        <div class="task-right">
          任务进度<span>{{ self_v }}/{{ self_c }}</span>
          <div class="jindu">
            <p
              v-bind:style="{ width: '' + (self_v / self_c) * 237 + 'px' }"
            ></p>
          </div>
        </div>
      </div>
      <div class="task-lts" v-if="lst_Random.length > 0">
        <div class="task-lts-left">
          <p class="DayTask-name">
            每日任务 <span>( {{ self_v }}/{{ self_c }} )</span>
          </p>
          <p class="rush-box">
            <el-tooltip
              v-if="baseData.flag_refreshed == 0"
              class="item"
              effect="dark"
              content="点击任务刷新按钮，可将【未完成】状态的任务替换成新的任务。如作者配置的任务池数量少于5个，则无法替换。"
              placement="bottom"
            >
              <i
                class="rush-task"
                style="cursor: pointer"
                v-on:click="_RefreshTask"
              ></i>
            </el-tooltip>
          </p>
        </div>
        <div class="task-lts-right">
          <ul>
            <li v-for="(item, index) in lst_Random" v-bind:key="index">
              <div class="exp">
                <i class="exp-icon"></i>
                <em>{{ `x${item.gift_num}` }}</em>
              </div>
              <div class="task-desc">
                {{ `${item.task_name} (${item.v}/${item.cv})` }}
              </div>
              <a
                href="javascript:;"
                v-show="item.taskFlag == 0"
                class="task-lq"
                v-waves
                v-on:click="_RcvTask('p', item.task_id)"
                >领取</a
              >
              <a
                href="javascript:;"
                v-show="item.taskFlag == -1"
                v-on:click="_RcvTask('p', item.task_id)"
                class="task-bklq"
                v-waves
                >不可领取</a
              >
              <a
                href="javascript:;"
                v-show="item.taskFlag == 1"
                class="task-ylq"
                v-waves
                v-on:click="_RcvTask('p', item.task_id)"
                >已领取</a
              >
            </li>
          </ul>
        </div>
      </div>
    </div>
    <!-- 每日任务 -->

    <!-- 挑战任务 -->
    <div class="challenge-task">
      <div class="task-xian"></div>
      <div class="task-hd">
        <div class="task-left">
          <i class="icon-task"></i
          ><span style="margin-right: 10px">挑战任务-任务截止时间:</span
          ><em>{{ task_ed_time }}</em>
          <el-tooltip
            v-if="baseData.flag_refreshed == 0"
            class="item"
            effect="dark"
            content="通行证任务只统计主账号的有效游戏局数据（即产生积分弹框），请使用主账号参与活动！"
            placement="bottom"
          >
            <i
              class="el-icon-warning-outline"
              style="
                cursor: pointer;
                color: rgba(255, 58, 50, 1);
                margin-left: 5px;
                font-weight: bold;
              "
            ></i>
          </el-tooltip>
        </div>
        <div class="task-right">
          任务进度<span>{{ advanced_v }}/{{ advanced_c }}</span>
          <div class="jindu">
            <p
              v-bind:style="{
                width: '' + (advanced_v / advanced_c) * 237 + 'px',
              }"
            ></p>
          </div>
        </div>
      </div>
      <div class="challenge-lts">
        <ul>
          <li>
            <div class="challenge-left">
              <h5>
                {{ `挑战任务1 ( ${self_advanced_1.v}/${self_advanced_1.cv} )` }}
              </h5>
              <p><em>（获得1000经验）</em></p>
              <a
                href="javascript:;"
                v-if="self_advanced_1.taskFlag == 0"
                class="challenge-lq"
                v-waves
                v-on:click="_RcvSelfTask(1)"
                >领取</a
              >
              <a
                href="javascript:;"
                v-if="self_advanced_1.taskFlag == -1"
                class="challenge-bklq"
                v-waves
                v-on:click="_RcvSelfTask(1)"
                >不可领取</a
              >
              <a
                href="javascript:;"
                v-if="self_advanced_1.taskFlag == 1"
                class="challenge-ylq"
                v-waves
                v-on:click="_RcvSelfTask(1)"
                >已领取</a
              >
            </div>
            <div class="challenge-right">
              <div
                class="challenge-items"
                v-for="(item, index) in lst_advanced_1"
                v-bind:key="index"
              >
                <span class="exp-box"><i class="exp"></i><em>x500</em></span>
                <span class="challenge-desc">{{
                  `${item.task_name} (${item.v}/${item.cv})`
                }}</span
                ><a
                  href="javascript:;"
                  class="challenge-items-lq"
                  v-show="item.taskFlag == 0"
                  v-waves
                  v-on:click="_RcvTask('a', item.task_id)"
                  >领取</a
                >
                <a
                  href="javascript:;"
                  class="challenge-items-ylq"
                  v-show="item.taskFlag == 1"
                  v-waves
                  v-on:click="_RcvTask('a', item.task_id)"
                  >已领取</a
                >
                <a
                  href="javascript:;"
                  class="challenge-items-bklq"
                  v-show="item.taskFlag == -1"
                  v-waves
                  v-on:click="_RcvTask('a', item.task_id)"
                  >不可领取</a
                >
              </div>
            </div>
          </li>
          <li>
            <div class="challenge-left">
              <h5>
                {{ `挑战任务2 ( ${self_advanced_2.v}/${self_advanced_2.cv} )` }}
              </h5>
              <p><em>（获得1000经验）</em></p>
              <a
                href="javascript:;"
                v-waves
                v-if="self_advanced_2.taskFlag == 0"
                class="challenge-lq"
                v-on:click="_RcvSelfTask(2)"
                >领取</a
              >
              <a
                href="javascript:;"
                v-if="self_advanced_2.taskFlag == -1"
                class="challenge-bklq"
                v-waves
                v-on:click="_RcvSelfTask(2)"
                >不可领取</a
              >
              <a
                href="javascript:;"
                v-if="self_advanced_2.taskFlag == 1"
                class="challenge-ylq"
                v-waves
                v-on:click="_RcvSelfTask(2)"
                >已领取</a
              >
            </div>
            <div class="challenge-right">
              <div
                class="challenge-items"
                v-for="(item, index) in lst_advanced_2"
                v-bind:key="index"
              >
                <span class="exp-box"><i class="exp"></i><em>x500</em></span>
                <span class="challenge-desc">{{
                  `${item.task_name} (${item.v}/${item.cv})`
                }}</span
                ><a
                  href="javascript:;"
                  class="challenge-items-lq"
                  v-show="item.taskFlag == 0"
                  v-waves
                  v-on:click="_RcvTask('a', item.task_id)"
                  >领取</a
                >
                <a
                  href="javascript:;"
                  class="challenge-items-ylq"
                  v-show="item.taskFlag == 1"
                  v-waves
                  v-on:click="_RcvTask('a', item.task_id)"
                  >已领取</a
                >
                <a
                  href="javascript:;"
                  class="challenge-items-bklq"
                  v-show="item.taskFlag == -1"
                  v-waves
                  v-on:click="_RcvTask('a', item.task_id)"
                  >不可领取</a
                >
              </div>
            </div>
          </li>
          <li>
            <div class="challenge-left">
              <h5>
                {{ `挑战任务3 ( ${self_advanced_3.v}/${self_advanced_3.cv} )` }}
              </h5>
              <p><em>（获得1000经验）</em></p>
              <a
                href="javascript:;"
                v-if="self_advanced_3.taskFlag == 0"
                class="challenge-lq"
                v-waves
                v-on:click="_RcvSelfTask(3)"
                >领取</a
              >
              <a
                href="javascript:;"
                v-if="self_advanced_3.taskFlag == -1"
                class="challenge-bklq"
                v-waves
                v-on:click="_RcvSelfTask(3)"
                >不可领取</a
              >
              <a
                href="javascript:;"
                v-if="self_advanced_3.taskFlag == 1"
                class="challenge-ylq"
                v-waves
                v-on:click="_RcvSelfTask(3)"
                >已领取</a
              >
            </div>
            <div class="challenge-right">
              <div
                class="challenge-items"
                v-for="(item, index) in lst_advanced_3"
                v-bind:key="index"
              >
                <span class="exp-box"><i class="exp"></i><em>x500</em></span>
                <span class="challenge-desc">{{
                  `${item.task_name} (${item.v}/${item.cv})`
                }}</span
                ><a
                  href="javascript:;"
                  class="challenge-items-lq"
                  v-show="item.taskFlag == 0"
                  v-waves
                  v-on:click="_RcvTask('a', item.task_id)"
                  >领取</a
                >
                <a
                  href="javascript:;"
                  class="challenge-items-ylq"
                  v-show="item.taskFlag == 1"
                  v-waves
                  v-on:click="_RcvTask('a', item.task_id)"
                  >已领取</a
                >
                <a
                  href="javascript:;"
                  class="challenge-items-bklq"
                  v-show="item.taskFlag == -1"
                  v-waves
                  v-on:click="_RcvTask('a', item.task_id)"
                  >不可领取</a
                >
              </div>
            </div>
          </li>
          <li>
            <div class="challenge-left">
              <h5 v-if="self_advanced_4">
                {{ `挑战任务4 ( ${self_advanced_4.v}/${self_advanced_4.cv} )` }}
              </h5>
              <p><em>（获得1000经验）</em></p>
              <a
                href="javascript:;"
                v-if="self_advanced_4 && self_advanced_4.taskFlag == 0"
                class="challenge-lq"
                v-waves
                v-on:click="_RcvSelfTask(4)"
                >领取</a
              >
              <a
                href="javascript:;"
                v-if="self_advanced_4 && self_advanced_4.taskFlag == -1"
                class="challenge-bklq"
                v-waves
                v-on:click="_RcvSelfTask(4)"
                >不可领取</a
              >
              <a
                href="javascript:;"
                v-if="self_advanced_4 && self_advanced_4.taskFlag == 1"
                class="challenge-ylq"
                v-waves
                v-on:click="_RcvSelfTask(4)"
                >已领取</a
              >
            </div>
            <div class="challenge-right" v-if="lst_advanced_4.length > 0">
              <div
                class="challenge-items"
                v-for="(item, index) in lst_advanced_4"
                v-bind:key="index"
              >
                <span class="exp-box"><i class="exp"></i><em>x500</em></span>
                <span class="challenge-desc">{{
                  `${item.task_name} (${item.v}/${item.cv})`
                }}</span
                ><a
                  href="javascript:;"
                  class="challenge-items-lq"
                  v-show="item.taskFlag == 0"
                  v-waves
                  v-on:click="_RcvTask('a', item.task_id)"
                  >领取</a
                >
                <a
                  href="javascript:;"
                  class="challenge-items-ylq"
                  v-show="item.taskFlag == 1"
                  v-waves
                  v-on:click="_RcvTask('a', item.task_id)"
                  >已领取</a
                >
                <a
                  href="javascript:;"
                  class="challenge-items-bklq"
                  v-show="item.taskFlag == -1"
                  v-waves
                  v-on:click="_RcvTask('a', item.task_id)"
                  >不可领取</a
                >
              </div>
            </div>
          </li>
        </ul>
      </div>
    </div>
    <!-- 挑战任务 -->

    <!-- 任务奖励 -->
    <div class="reward-box" v-show="LimitedGifts.length > 0">
      <div class="task-xian"></div>
      <div class="task-hd">
        <div class="task-left">
          <i class="icon-task2"></i
          ><span style="margin-right: 10px">活动限定奖励-领取截止时间:</span
          ><em>{{ ed_time }}</em>
        </div>
        <div class="task-right">
          限定奖励领取 <span>{{ v }}/{{ c }}</span>
          <div class="jindu">
            <p
              v-bind:style="{
                width: '' + (v / c) * 237 + 'px',
              }"
            ></p>
          </div>
        </div>
      </div>
      <div class="reward-lts">
        <ul>
          <li v-for="(item, index) in LimitedGifts" :key="index">
            <div class="reward-img-box">
              <div
                class="detail-info"
                v-show="item.seen"
                :style="{ left: tranLeft, top: tranTop }"
              >
                <div class="in-detail-info">
                  <div class="row" v-show="item.price">
                    <i class="jiazhi"></i> <span>奖项价值:</span
                    ><b>{{ item.price }}元</b>
                  </div>
                  <div class="row2" v-show="item.desc">
                    <p class="title"><i class="sm"></i>奖项说明：</p>
                    <p>{{ item.desc }}</p>
                  </div>
                  <div class="row2" v-show="item.show_desc">
                    <p class="title"><i class="mingxi"></i>奖品明细：</p>
                    <p>{{ item.show_desc }}</p>
                  </div>
                </div>
              </div>
              <i v-if="item.rarity" v-bind:class="item.rarity"></i>
              <img
                v-bind:src="item.img"
                alt=""
                v-on:mouseenter.stop="handleMouseOver(item, $event)"
                v-on:mouseleave.stop="onMouseOut(item)"
              />
              <p class="limit-kuang"></p>
            </div>
            <div class="reward-info">
              <h5>{{ item.name }}</h5>
              <div class="reward-info-desc">
                <p>
                  领取条件：<em>{{ item.show_desc }}</em>
                </p>
                <p>
                  <span
                    >可领取数量：<em>{{ item.remain }}</em>
                  </span>
                  <span v-if="item.num_if && item.num_if > 0"
                    >| 可兑换积分数:<em>100</em>{{ item.num_if }}</span
                  >
                </p>
                <p>发放物品:{{ item.send_desc }}</p>
              </div>
            </div>
            <a
              href="javascript:;"
              class="lq-btn"
              style="right: 49px"
              v-if="item.rcv_flag == 0"
              @click="_RcvLimitedGift(item.sort)"
              >领取</a
            >
            <a
              href="javascript:;"
              class="ylq-btn"
              style="right: 49px"
              v-if="item.rcv_flag == 1"
              @click="_RcvLimitedGift(item.sort)"
              >已领取</a
            >
            <a
              href="javascript:;"
              class="bklq-btn"
              style="right: 49px"
              v-if="item.rcv_flag == -1"
              @click="_RcvLimitedGift(item.sort)"
              >不可领取</a
            >
          </li>
        </ul>
      </div>
    </div>
    <!-- 任务奖励 -->
    <!-- 通行证弹窗 -->
    <transition name="fade">
      <div class="model" v-show="passFlag">
        <div class="in-model">
          <i class="close" v-on:click="passFlag = false">×</i>
          <h1 class="warning-tips">
            <i class="warning"></i>重要提示：不支持多买/错买退款，请谨慎购买！
          </h1>
          <div class="goods-buy">
            <div class="goods_buy_box_item">
              <img v-bind:src="baseData.icon_primary_pass" alt="" />
              <p>{{ ed_time }}前有效</p>
              <h5>{{ baseData.name_primary_pass }}</h5>
              <div class="price" v-if="!baseData.goods_primary_isfree">
                <b>{{ `￥${baseData.price_primary_pass}` }}/</b>
                <b>1个</b>
              </div>
              <div class="price" v-if="baseData.goods_primary_isfree">免费</div>
              <div class="number-box" v-if="!baseData.goods_primary_isfree">
                <!-- <div class="remove" ></div> -->
                <input
                  type="text"
                  v-model="message01"
                  v-bind:disabled="true"
                  style="margin: 0 auto"
                />
                <!-- <div class="add"></div> -->
              </div>
              <a
                href="javascript:;"
                class="goods_lq"
                v-if="
                  baseData.goods_primary_isfree &&
                  baseData.flag_primary_pass == 0
                "
                v-on:click="RcvFreePrimaryPass"
                >立即领取</a
              >
              <a
                href="javascript:;"
                class="goods_lq"
                v-if="
                  baseData.goods_primary_isfree &&
                  baseData.flag_primary_pass != 0
                "
                v-on:click="RcvFreePrimaryPass"
                >已领取</a
              >
              <a
                href="javascript:;"
                class="goods_gm"
                v-if="!baseData.goods_primary_isfree"
                v-on:click="gmProduct(message01, baseData.goodsid_primary_pass)"
                >立即购买</a
              >
            </div>
            <div
              class="goods_buy_box_item"
              v-if="!baseData.advanced_pass_isclose"
            >
              <img v-bind:src="baseData.icon_advacned_pass" alt="" />
              <p>{{ ed_time }}前有效</p>
              <h5>{{ baseData.name_advanced_pass }}</h5>
              <div class="price">
                <b>{{ `￥${baseData.price_advanced_pass}` }}/</b>
                <b>1个</b>
              </div>
              <div class="number-box">
                <!-- <div class="remove"></div> -->
                <input
                  type="text"
                  v-bind:disabled="true"
                  v-model="message02"
                  style="margin: 0 auto"
                />
                <!-- <div class="add"></div> -->
              </div>
              <a
                href="javascript:;"
                class="goods_gm"
                v-on:click="
                  gmProduct(message02, baseData.goodsid_advanced_pass)
                "
                >立即购买</a
              >
            </div>
            <div class="goods_buy_box_item">
              <img v-bind:src="baseData.icon_exe" alt="" />
              <p>{{ ed_time }}前有效</p>
              <h5>等级经验</h5>
              <div class="price">
                <b>{{ `￥${baseData.price_exe}` }}/</b>
                <b>1级</b>
              </div>
              <div class="number-box">
                <div class="remove" v-on:click="relsove(3)"></div>
                <input type="text" v-model="message03" />
                <div class="add" v-on:click="add(3)"></div>
              </div>
              <a
                href="javascript:;"
                v-on:click="gmProduct(message03, baseData.goodsid_exe)"
                class="goods_gm"
                >立即购买</a
              >
            </div>
          </div>
          <a href="javascript:;" class="read-buy" v-on:click="_QueryHistory">
            查看购买记录</a
          >
        </div>
      </div>
    </transition>

    <!-- 通行证弹窗 -->

    <!-- 支付弹窗 -->
    <transition name="fade">
      <div class="model" v-show="isShow">
        <div class="inModel-iframe">
          <i class="closeBtn" v-on:click="closeModel"></i>
          <iframe
            id="iframe1"
            v-bind:src="srcUrl"
            width="604"
            height="420"
            scrolling="no"
            frameborder="0"
            allowtransparency="true"
            style="background-color: transparent"
          ></iframe>
        </div>
      </div>
    </transition>

    <!-- 支付弹窗 -->

    <!-- 活动说明弹窗 -->
    <transition name="fade">
      <div class="model" v-show="shuomingFlag">
        <div class="in-model">
          <i class="close" v-on:click="shuomingFlag = false">×</i>
          <div class="rules">
            <p>
              1.奖励领取时间
              <span
                ><em>{{ st_time }}~{{ ed_time }}</em></span
              >
            </p>
            <p>
              2.任务领取时间
              <span
                ><em>{{ st_time }}~{{ task_ed_time }}</em></span
              >
            </p>
            <p>
              3.活动参与资格：购买通行证即可获取活动参与资格，所购买的通行证只在本地图的本次活动期限内有效，活动结束后通行证即失效。
            </p>
            <p>1） 购买初级通行证即有资格领取初级通行证奖励；</p>
            <p>2）购买高级通行证即有资格领取高级通行证奖励。</p>
            <p>
              4.通行证等级：需升级通行证等级才可领取对应等级的通行证奖励；用户可通过完成任务，领取任务经验升级等级，也可直接购买等级经验快速升级。
            </p>
            <p>5.通行证奖励领取：</p>
            <p>
              1）通行证奖励需在活动页面主动领取，奖励只能在【奖励领取有效期】内领取，活动结束下线后即失效，请及时领取；
            </p>
            <p>
              2）通行证奖励-积分转化：如作者对某项限时/永久时效的等级奖励设置了转化积分，且用户领取前已经拥有永久时效的此道具无法再叠加时效，领取时系统会自动将奖励转化为地图积分发放，转化数量由地图作者设置；如作者未设置转化积分，则无法转化。地图积分发放情况可通过签到页面-积分领取记录查询。
            </p>
            <p>
              6.通行证任务奖励：任务奖励需在活动页面主动领取，且奖励必须在任务刷新前领取，过期无法补领，请及时领取。
            </p>
            <p>1）每日任务：每日刷新一次，请于【次日6：00前】及时领取；</p>
            <p>
              2）进阶任务：每期活动刷新一次，请于【任务领取时间内】及时领取。
            </p>
            <p>7.任务统计条件：</p>
            <p>
              1）
              <em>只有有效游戏局（产生积分弹框）才能被计算任务积分</em
              >，即不是所有游戏局都能有积分，有效游戏局条件由地图作者定义。
            </p>
            <p>
              2）<em>所有任务均统计主账号积分数据</em>，请玩家使用主账号游戏及领取奖励。
            </p>
            <p>
              8.活动免责申明：本次活动所有内容均由活动地图的地图作者自定义，11对战平台秉着公平、公正、公开、真实的原则，对于本次活动，我司声明以下免责条款，参加活动前请用户仔细阅读所有条款，参加本次活动即表明用户了解并接受所有条款内容。
            </p>
            <p>
              1）本活动期间发生任何不可抗力事件使本次活动或本次活动目的不能实现，11对战平台因此免责。不可抗力是指不能控制、不可预见或不能避免，即使预见亦无法避免的事件，该事件使任何一方根据本协议履行其全部或部分义务已不可能。包括社会异常事件、自然灾害或政府管制行为而造成的网络关闭等非基于11对战平台过错的行为。
            </p>
            <p>
              2）鉴于互联网之特殊性质，活动期间若发生黑客攻击、电信部门技术调整导致重大影响、病毒侵袭、网络故障、带宽、域名解析故障或其他网络设备或技术提供商的服务延迟、服务障碍或任何其他类似事件，致使活动无法正常进行，11对战平台因此免责。
            </p>
            <p>
              3）用户自身主观过错或恶意，如通技术手段恶意攻击或篡改致使活动发生错误等不正当手段参与活动，致使此次活动无效的，11对战平台因此免责。
            </p>
            <p>
              4）因地图方原因导致本次活动目的不能实现，例如地图存在重大问题导致地图无法运行，或地图存在违反平台规定或相关法律法规行为无法运营等，11对战平台因此免责。
            </p>
          </div>
        </div>
      </div>
    </transition>
    <!-- 活动说明弹窗 -->
    <!-- 我的领取记录 -->
    <transition name="fade">
      <div class="model" v-show="lqFlag">
        <div class="in-model">
          <i class="close" @click="lqFlag = false">×</i>
          <h1>满级奖励-领取记录</h1>
          <div class="tbl_top">
            <span>领取用户</span>
            <span>领取道具</span>
            <span class="current">领取时间</span>
          </div>
          <div class="tbl">
            <ul>
              <li v-for="(item, index) in LimitedHistoryLists" :key="index">
                <span>{{ item.user_name }}</span>
                <span>{{ item.show_name }}</span>
                <span class="current">
                  <em>{{ item.str_create_time }}</em>
                </span>
              </li>
            </ul>
          </div>
        </div>
      </div>
    </transition>

    <!-- 我的领取记录 -->

    <!-- 我的购买购买记录 -->
    <transition name="fade">
      <div class="model" v-show="buyFlag">
        <div class="in-model">
          <i class="close" @click="buyFlag = false">×</i>
          <h1>购买记录</h1>
          <div class="tbl_top">
            <span>用户名</span>
            <span>购买时间</span>
            <span class="current">购买物品*数量</span>
          </div>
          <div class="tbl">
            <ul>
              <li v-for="item in buyList" :key="item.id">
                <span>{{ item.user_name }}</span>
                <span>{{ item.show_name }}</span>
                <span class="current">
                  <em>{{ item.create_time }}</em>
                </span>
              </li>
            </ul>
          </div>
        </div>
      </div>
    </transition>

    <!-- 我的购买购买记录 -->
    <!-- 满级奖励领取纪录 -->
    <transition name="fade">
      <div class="model" v-show="fullFlag">
        <div class="in-model">
          <h1>满级奖励领取纪录</h1>
          <i class="close" v-on:click="fullFlag = false">×</i>

          <div class="tbl_top" style="width: 700px">
            <span>奖励类型</span>
            <span>等级</span>
            <span class="current">领取时间</span>
            <span class="current">奖励内容</span>
          </div>
          <div class="tbl">
            <ul style="width: 700px" v-if="fullLogs.length > 0">
              <li v-for="(item, index) in fullLogs" :key="index">
                <span>{{ item.tName }}</span>
                <span>{{ `Lv.${item.pass_level}` }}</span>
                <span class="current">
                  <em>{{ item.str_create_time }}</em>
                </span>
                <span class="current">
                  <em>{{ item.gift_desc }}</em>
                </span>
              </li>
            </ul>
          </div>
        </div>
      </div>
    </transition>
    <!-- 满级奖励领取纪录 -->
    <!-- 活动中心 -->
    <transition name="fade">
      <div class="model" v-show="activeFlag">
        <div class="activeMain">
          <i class="close" v-on:click="activeFlag = false">×</i>
          <h1>活动中心-{{ act_title }}</h1>
          <ul>
            <li v-for="(item, index) in activeLts" v-bind:key="index">
              <p>{{ item.str_ed_time }}结束</p>
              <em
                v-show="act_id == item.active_id"
                class="current-act"
                style="color: #fd0a0a"
              ></em>
              <h5>
                【{{
                  item.active_type == 1
                    ? "抽奖活动"
                    : item.active_type == 3
                    ? "通行证活动"
                    : ""
                }}】 {{ item.active_title }}
              </h5>
              <a
                v-bind:href="
                  'qfyygame:///type=web_action/?action_type=2&web_url=' +
                  item.url +
                  '&login_mode=2'
                "
                class="ljcy"
              ></a>
            </li>
          </ul>
        </div>
      </div>
    </transition>
    <!-- 活动中心 -->
  </div>
</template>

<script>
import { getTemplateData, GetGiftData, GetTaskData, GetFullGift, GetLimitedGift, RcvGloryGift, RcvAll, RcvTask, RcvSelfTask, RcvLimitedGift, RcvFreePrimaryPass, GetShop11Pay, LimitedHistory, QueryHistory, GetAllActivity, RcvFullGift, RefreshTask, GetLogFullLevel } from '@/api/request'
import { jsonTime } from "@/utils/utils"
import { Message } from "element-ui"
import { debounce } from "lodash"

export default {
  name: 'Index',
  data () {
    return {
      act_id: '',
      baseData: '',
      act_title: '',
      st_time: '',
      task_ed_time: '',
      ed_time: '',
      exe: '',
      lst_gift: [],
      totalNumber: 0,
      tranLeft: 0,
      tranTop: 0,
      showName: '',
      num: 0,
      FullLts: [],
      lst_Random: [],
      self_advanced_1: "",
      self_advanced_2: "",
      self_advanced_3: "",
      self_advanced_4: "",
      lst_advanced_1: [],
      lst_advanced_2: [],
      lst_advanced_3: [],
      lst_advanced_4: [],
      self_c: 0,
      self_v: 0,
      advanced_c: 0,
      advanced_v: 0,
      LimitedGifts: [],
      lqFlag: false,
      LimitedHistoryLists: [],
      c: 0,
      v: 0,
      message01: 1,
      message02: 1,
      message03: 1,
      message04: 1,
      srcUrl: "",
      isShow: false,
      passFlag: false,
      shuomingFlag: false,
      buyList: [],
      buyFlag: false,
      activeFlag: false,
      activeLts: [],
      map_id: 0,
      flag_rcv_all: '',
      fullFlag: false,
      fullLogs: [],
      temp_style: ''

    }
  },
  watch: {
    "$route": {
      handler (val, old) {
        console.log('val', val)
        if (val) {
          this.act_id = val.params.id
          this._getTemplateData()
          this._GetGiftData()
          this.GetTaskDataFn()
          this.GetLimitedGiftFn()
        } else {
          return
        }

      },
      immediate: false
    },
  },
  computed: {
    lengthW: function () {
      return this.exe / 30 + "%"
    },
  },
  mounted () {
    if (this.$route.params.id) {
      this.act_id = this.$route.params.id
      this._getTemplateData()
      this._GetGiftData()
      this.GetTaskDataFn()
      this.GetLimitedGiftFn()
    } else {
      return
    }
  },
  methods: {
    async _getTemplateData () {
      import('@/assets/css/index.css')
      const res = await getTemplateData(this.act_id)
      this.GetFullGiftFn()
      this.temp_style = res.data.temp_style
      console.log('this.temp_style', this.temp_style)
      if (res.data) {
        if (this.temp_style == 0) {
          import('@/assets/css/index.css')
        } else if (this.temp_style > 0) {
          import(`@/assets/css/index${this.temp_style}.css`)
        } else {
          import('@/assets/css/index.css')
        }
        this.baseData = res.data
        this.act_title = res.data.act_title
        this.st_time = jsonTime(res.data.st_time)
        this.ed_time = jsonTime(res.data.ed_time)
        this.task_ed_time = jsonTime(res.data.task_ed_time)

        this.exe = res.data.exe
      }

    },
    async _GetGiftData () {
      const res = await GetGiftData(this.act_id)
      //console.log(res)
      if (res.errCode == 0) {
        const { data } = res
        this.flag_rcv_all = data.flag_rcv_all
        if (data && data.lst_gift.itm_primary) {
          data.lst_gift.itm_primary.forEach(item => {
            this.$set(item, 'seen', false)
          })
        } else if (data && data.lst_gift.itm_advanced) {
          data.lst_gift.itm_primary.forEach(item => {
            this.$set(item, 'seen', false)
          })
        }

        this.lst_gift = data.lst_gift
        this.totalNumber = Math.ceil(data.lst_gift.length / 5)
      }

    },
    moveRight () {
      //debugger
      if (this.num < this.totalNumber - 1) {
        this.num++
      } else if (this.num >= this.totalNumber - 1) {
        this.num = this.totalNumber - 1
      }
      this.$refs.ulBox.style.left = -this.num * 745 + "px"
    },
    moveLeft () {
      if (this.num <= 0) {
        this.num = 0
      } else {
        this.num--
      }
      this.$refs.ulBox.style.left = -this.num * 745 + "px"
    },
    //满级奖励
    async GetFullGiftFn () {
      const result = await GetFullGift(this.act_id)

      if (result.errCode == 0) {
        result.data.forEach(element => {
          element.seen = false
          if (element.tp == 1) {
            element.show_tip = this.baseData.name_primary_pass
          } else if (element.tp == 2) {
            element.show_tip = this.baseData.name_advanced_pass
          }
        })
        console.log(11, result.data)
        this.FullLts = result.data
      }
    },
    //任务
    async GetTaskDataFn () {
      const result = await GetTaskData(this.act_id)
      if (result.errCode == 0) {
        const { data: res } = result
        ///  console.log(res)
        this.lst_Random = res.lst_Random
        this.self_advanced_1 = res.self_advanced_1
        this.self_advanced_2 = res.self_advanced_2
        this.self_advanced_3 = res.self_advanced_3
        this.self_advanced_4 = res.self_advanced_4
        this.lst_advanced_1 = res.lst_advanced_1
        this.lst_advanced_2 = res.lst_advanced_2
        this.lst_advanced_3 = res.lst_advanced_3
        this.lst_advanced_4 = res.lst_advanced_4
        this.self_c = res.self_c
        this.self_v = res.self_v
        this.advanced_c = res.advanced_c
        this.advanced_v = res.advanced_v
      }

    },
    //限定奖励领取
    async GetLimitedGiftFn () {
      const result = await GetLimitedGift(this.act_id)
      console.log(22, result)
      if (result.errCode < 0) return false
      const { data: res } = result
      this.c = res.c
      this.v = res.v
      if (res.lst && res.lst.length > 0) {
        res.lst.forEach(element => {
          element.seen = false
        })
        this.LimitedGifts = res.lst
      } else {
        this.LimitedGifts = []
      }


    },
    //领取奖励
    async _RcvGloryGift (val, lv) {
      console.log(val, lv)
      const result = await RcvGloryGift({
        id: this.act_id,
        type: val,
        level: lv,
      })
      console.log(result)
      if (result.errCode == 0) {
        Message.success(result.msg)
        this._GetGiftData()
        this._getTemplateData()
      } else {
        Message.error(result.msg)
      }
    },
    //领取全部奖励
    async RcvAllFn () {
      const result = await RcvAll(this.act_id)
      console.log(result)
      if (result.errCode == 0) {
        this._GetGiftData()
        this._getTemplateData()
      } else {
        Message.warning(result.msg)
      }
    },
    //领取任务奖励
    async _RcvTask (Typeid, Tid) {
      const result = await RcvTask({
        id: this.act_id,
        type: Typeid,
        tid: Tid,
      })
      console.log(result)
      if (result.errCode == 0) {
        this._getTemplateData()
        this.GetTaskDataFn()
      } else {
        Message.error(result.msg)
      }
    },
    //进阶任务领取
    async _RcvSelfTask (Typeid) {
      const result = await RcvSelfTask({
        id: this.act_id,
        ty: Typeid,
      })
      console.log(result)
      if (result.errCode == 0) {
        this._getTemplateData()
        this.GetTaskDataFn()
      } else {
        Message.error(result.msg)
      }
    },
    //满级奖励领取
    async RcvFullGiftFn (val) {
      console.log()
      var tid = ""
      if (val == 2) {
        tid = "g"
      } else {
        tid = "c"
      }
      const result = await RcvFullGift({ id: this.act_id, type: tid })
      if (result.errCode < 0) {
        Message.error(result.msg)
      } else {
        Message.success(result.msg)

      }
      this.GetFullGiftFn()
    },
    //满级奖励领取记录
    async GetLogFullLevelFn (tp) {
      console.log(tp)
      const result = await GetLogFullLevel({
        id: this.act_id,
        page_index: 1,
        page_size: 9999999,
        tp: tp
      })
      console.log("lv", result)
      if (result.errCode == 0) {
        result.data.data.forEach(item => {
          var name = ''
          if (tp == 1) {
            name = this.baseData.name_primary_pass
          } else if (tp == 2) {
            name = this.baseData.name_advanced_pass
          }
          item.tName = name
        })
        this.fullFlag = true
        this.fullLogs = result.data.data
      }
      return
    },
    //领取限定奖励
    async _RcvLimitedGift (val) {
      const result = await RcvLimitedGift({
        id: this.act_id,
        sort: val,
      })
      console.log(result)
      if (result.errCode < 0) {
        Message.error(result.msg)
      } else {
        Message.success(result.msg)

      }
      this.GetLimitedGiftFn()
    },
    async RcvFreePrimaryPass () {
      const result = await RcvFreePrimaryPass({ id: this.act_id })
      console.log(result)
      if (result.errCode == 0) {
        Message.success(result.msg)
        this._getTemplateData()
        this._GetGiftData()

      } else {
        Message.error(result.msg)
      }

    },
    //购买商品
    async gmProduct (val, goodsId) {
      debugger
      var numReg = /^[0-9]*$/
      var numRe = new RegExp(numReg)
      if (val <= 0) {
        Message.error("购买数量必须大于0")
      } else if (!numRe.test(val)) {
        Message.error("请输入数字")
      } else {
        const result = await GetShop11Pay({
          id: this.act_id,
          amount: val,
          gid: goodsId,
        })
        if (result.errCode == 0) {
          this.srcUrl = result.msg
          this.isShow = true
        } else {
          Message.error(result.msg)
        }
      }
    },
    add: function (val) {
      if (val == 3) {
        this.message03++
      }
    },
    relsove (val) {
      if (val == 3) {
        debugger
        if (this.message03 <= 1) {
          this.message03 = 1
        } else {
          this.message03--
        }
      }
    },
    closeModel () {
      this.srcUrl = ""
      this.isShow = false
      this._getTemplateData()
      this._GetGiftData()
      this.GetFullGiftFn()
      this.GetLimitedGiftFn()
    },
    add2: function () {
      this.message04++
    },
    relsove2 () {
      if (this.message04 <= 1) {
        this.message04 = 1
      } else {
        this.message04--
      }
    },
    //限定奖励领取记录
    async _LimitedHistoryLists () {
      const result = await LimitedHistory({ id: this.act_id })
      this.lqFlag = true
      console.log(result)
      if (result.errCode == 0) {
        this.LimitedHistoryLists = result.data
      }
    },
    async _QueryHistory () {
      const result = await QueryHistory({ id: this.act_id })
      console.log(result)
      if (result.errCode == 0) {
        this.buyFlag = true
        this.buyList = result.data
      } else {
        Message.error(result.msg)
      }
    },
    async activeCenter () {
      const result = await GetAllActivity({ mid: this.baseData.map_id })
      console.log(result)
      if (result.errCode == 0) {
        this.activeFlag = true
        this.activeLts = result.data
      } else {
        Message.error(result.msg)
      }
    },
    handleMouseOver: debounce(function (item, e, name) {
      this.onMouseOver(item, e, name)
    }, 50),
    onMouseOver (item, e, name) {
      console.log(11, item)
      this.showName = name
      this.tranLeft = (e.pageX - 197 - 15) + 'px'
      this.tranTop = (e.pageY - 233 - window.scrollY - 15) + 'px'
      item.seen = true
    },
    onMouseOut: debounce(function (item) {
      this.showName = ''
      this.tranLeft = 0
      this.tranTop = 0
      item.seen = false
    }, 60),
    //刷新任务
    async _RefreshTask () {
      const result = await RefreshTask(this.act_id)
      console.log(result)
      if (result.errCode == 0) {
        this.GetTaskDataFn()
        this._getTemplateData()
        Message.success(result.msg)
      } else {
        Message.error(result.msg)
      }
    },
  }


}
</script>
